import Grid from '@mui/material/Grid';
import Typography from '@mui/material/Typography';

import {_posts, _traffic,} from 'src/_mock';
import {DashboardContent} from 'src/layouts/dashboard';

import {AnalyticsNews} from '../analytics-news';
import {AnalyticsWidgetSummary} from '../analytics-widget-summary';
import {AnalyticsTrafficBySite} from '../analytics-traffic-by-site';

// ----------------------------------------------------------------------

export function OverviewAnalyticsView() {
    return (
        <DashboardContent maxWidth="xl">
            <Typography variant="h4" sx={{mb: {xs: 3, md: 5}}}>
                系统观测 👋
            </Typography>

            <Grid container spacing={3}>
                {/* uname -s && uname -a */}
                <Grid size={{xs: 12, sm: 6, md: 3}}>
                    <AnalyticsWidgetSummary
                        title="操作系统"
                        product='Linux'
                        description='x86_64'
                        icon={<img alt="处理器" src="/assets/icons/glass/ic-glass-cpu.svg"/>}
                        chart={{
                            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug'],
                            series: [22, 8, 35, 50, 82, 84, 77, 12],
                        }}
                    />
                </Grid>
                {/* 查询容量：awk '/MemTotal/ {printf "MemTotal: %.2f GB\n", $2/1024/1024}' /proc/meminfo*/}
                <Grid size={{xs: 12, sm: 6, md: 3}}>
                    <AnalyticsWidgetSummary
                        title="内存"
                        product="容量"
                        description='64G'
                        color="secondary"
                        icon={<img alt="内存" src="/assets/icons/glass/ic-glass-memory.svg"/>}
                        chart={{
                            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug'],
                            series: [56, 47, 40, 62, 73, 30, 23, 54],
                        }}
                    />
                </Grid>

                {/*du -sh /home*/}
                <Grid size={{xs: 12, sm: 6, md: 3}}>
                    <AnalyticsWidgetSummary
                        title="存储"
                        product="/home"
                        description="847G"
                        color="warning"
                        icon={<img alt="存储" src="/assets/icons/glass/ic-glass-storage.svg"/>}
                        chart={{
                            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug'],
                            series: [40, 70, 50, 28, 70, 75, 7, 64],
                        }}
                    />
                </Grid>

                {/*ip addr | grep "inet 192\." | awk '{print $2}' | cut -d'/' -f1*/}
                <Grid size={{xs: 12, sm: 6, md: 3}}>
                    <AnalyticsWidgetSummary
                        title="IP"
                        product='局域网'
                        description='192.168.1.1'
                        color="error"
                        icon={<img alt="IP" src="/assets/icons/glass/ic-glass-ip.svg"/>}
                        chart={{
                            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug'],
                            series: [56, 30, 23, 54, 47, 40, 62, 73],
                        }}
                    />
                </Grid>
                <Grid size={{xs: 12, md: 6, lg: 4}}>
                    <AnalyticsTrafficBySite title="系统环境" list={_traffic}/>
                </Grid>
                <Grid size={{xs: 12, md: 6, lg: 8}}>
                    <AnalyticsNews title="项目清单" list={_posts.slice(0, 5)}/>
                </Grid>
            </Grid>
        </DashboardContent>
    );
}
